<style type="text/css">
    div.mainRainbowHeadUserProfileWidget {
        width:260px;
        min-height:36px;
    }
    div.mainRainbowHeadUserProfileWidget img {
        width:30px;
        margin:2px 10px 2px 2px;
        float:left;
        border:1px solid #ffffff;
    }
    ul.userProfileActionExtWidget {
        display:none;
        width:260px;
        margin:10px 0 0 0;
        padding:0;
        list-style-type:none;
        text-align:center;
        font-size:24px;
    }
    ul.userProfileActionExtWidget li {
        padding:10px;
    }
    div.mainRainbowHeadUserProfileWidget:hover {
    }
    div.mainRainbowHeadUserProfileWidget:hover ul.userProfileActionExtWidget {
        display:block;
        background:#696969;
        color:white;
    }
</style>
{% if user.is_authenticated %}
<div class="mainRainbowHeadUserProfileWidget">
    <div style="line-height:36px;min-height:36px;">
        <img src="/static/rainbow/images/0/default.jpeg"/>
        <label>{{ user.profile.nickname.value }}</label>
        <a href="/eagleye/logout/">
            <label style="float:right;padding-right:20px;">登出</label>
        </a>
    </div>
    <div style="position:absolute;">
        <ul class="userProfileActionExtWidget">
            <li>
                <a href="/rainbow/album/of/user/{{ user.id }}/list">
                    <label>我的相册</label>
                </a>
            </li>
            <li>b</li>
        </ul>
    </div>
</div>
{% else %}
    <div class="mainRainbowHeadUserProfileWidget" style="line-height:36px;">
        <a href="/eagleye/register/">
            <label style="float:right;">注册</label>
        </a>
        <a href="/eagleye/login/">
            <label style="float:right;">登陆</label>
        </a>
    </div>
{% endif %}